import React from 'react'
import { Form, Input,Button,Col} from 'antd';
const FormItem = Form.Item;
import StateMixin from 'reflux-state-mixin';
// import SelectAdmin from 'pages/config/user/selectAdmin.jsx'
// import SrvListAction from 'pages/servicelist/actions/serviceListAction.js'
import SrvListStore from 'pages/servicelist/stores/serviceListStore.js'
// import IconTypes from 'config/modelIcon'
let BasicInfoForm = React.createClass({
  mixins: [StateMixin.connect(SrvListStore)],
  getInitialState() {
    return {
      selectAdminVisible: false,
      addAuthedUserVisible: false,
      groupChecked: false
    };
  },
  changeIcon(name) {
    this.props.changeIcon(name);
  },
  savefileId(fileId) {
    this.props.savefileId(fileId);
  },
  //分开判断并清空state  解决保存模型时后台报错  前端清空管理员及用户组信息
  componentWillReceiveProps() {
   
  },
  groupCheck(val) {
    this.setState({
      groupChecked: val
    })
  },
  componentWillUnmount() {
    // ModelAction.clearModel();
  },
  handleCheck(type, rule, value, callback) {
    callback();
  },
  handleAddIcon() {
    alert("icon")
  },
  handleAddUser() {
    alert("user")
  },
  render() {
    const {getFieldProps} = this.props.form;

    const titleNameProps = getFieldProps('title', {
      initialValue: this.state.info.title,
      rules: [{
        validator: this.handleCheck.bind(this, "title")
      }]
    });

    const createNameProps = getFieldProps('authorName', {
      initialValue: this.state.info.authorName,
      rules: [{
        validator: this.handleCheck.bind(this, "authorName")
      }]
    });

    const descriptionProps = getFieldProps('description', {
      initialValue: this.state.info.description,
      rules: [{
        min: 0,
        max:100,
        message: "目录描述"
      }]
    });

    const formItemLayout = {
      labelCol: {
        span: 2
      },
      wrapperCol: {
        span: 12
      }
    };

    return (
      <div className="model-form-section basic-info">
        <h3>
          <strong>基本信息</strong>
        </h3>
        <Form horizontal>
          <FormItem {...formItemLayout} label="目录名称" hasFeedback required>
            <Input {...titleNameProps} placeholder={"目录名称不得超过10个字符"}/>
            <div className='del-input' onClick={this.handleDelInput}/>
          </FormItem>

           <FormItem {...formItemLayout} label="创建人" hasFeedback required>
            <Col span="6">
              <FormItem>
                 <Input  {...createNameProps} placeholder={"选择创建人"}/>
              </FormItem>
            </Col>
            <Col span="1">
            <p className="ant-form-split" />
            </Col>
            <Col span="6">
              <FormItem>
               <Button type="primary" icon="plus" onClick={this.handleAddUser} disabled={true}>
                创建人
               </Button>
              </FormItem>
            </Col>
          </FormItem>
    
          <FormItem {...formItemLayout} label="目录描述" hasFeedback>
            <Input {...descriptionProps} placeholder={ "请完善目录描述，便于团队内的理解"}
              type="textarea" />
          </FormItem>
          <FormItem {...formItemLayout} label="目录图标" hasFeedback  >
            <Button type="primary" icon="plus" onClick={this.handleAddIcon} disabled={true}>
                选择图标
            </Button>
          </FormItem>
        </Form>
      </div>
    );
  }
});

export default Form.create()(BasicInfoForm);
